<head>
<link rel="stylesheet" href="/eSDK_OpenAPI_Demo_BS_JAVA/css/tree.css"
	type="text/css">
<link rel="stylesheet"
	href="/eSDK_OpenAPI_Demo_BS_JAVA/css/zTreeStyle.css" type="text/css">
<link rel="stylesheet" href="/eSDK_OpenAPI_Demo_BS_JAVA/css/demo.css"
	type="text/css" />
<link href="/eSDK_OpenAPI_Demo_BS_JAVA/css/thickbox.css" media="screen"
	rel="stylesheet" type="text/css" />
<script type="text/javascript"
	src="/eSDK_OpenAPI_Demo_BS_JAVA/js/jquery-1.8.3.js"></script>
<script type="text/javascript"
	src="/eSDK_OpenAPI_Demo_BS_JAVA/js/jquery.ztree.core-3.5.js"></script>
<script src="/eSDK_OpenAPI_Demo_BS_JAVA/js/en-us.js"
	type="text/javascript"></script>
<script src="/eSDK_OpenAPI_Demo_BS_JAVA/js/zh-cn.js"
	type="text/javascript"></script>
<script src="/eSDK_OpenAPI_Demo_BS_JAVA/js/demotools.js"
	type="text/javascript"></script>

<script type="text/javascript">
	function createPortGroup() {
		var name = $("#portGroupname").val();
		var description = $("#portGroupDescription").val();
		var associateId = $("#associateId_port").val();
		// 简单参数校验
		if (isEmpty(name)) {
			$("#portGroupnameErrTip").html(
					controller.language.titles["nameErrTip"]);
			return false;
		} else {
			$("#portGroupnameErrTip").html("");
		}
		$
				.ajax({
					url : "/eSDK_OpenAPI_Demo_BS_JAVA/openapiServlet",
					type : "post",
					dataType : "json",
					data : "&name=" + name + "&description=" + description
							+ "&associateId=" + associateId
							+ "&method=createPortGroup",
					async : false,
					success : function(data) {
						if ("success" == data) {
							self.parent.tb_remove();
						} else {
							$("#PortGroup_status").html(data);
						}
					},
					error : function(data) {
						$("#PortGroup_status").html(
								controller.language.titles["operationFailed"]);
					},
					beforeSend : function() {
						$("#PortGroup_status").html("");
					}
				});
	}
	function load() {
		changeLang();
		updatePort();
	}
	function updatePort() {
		var portType = $("#portType").val();
		$
				.ajax({
					url : "/eSDK_OpenAPI_Demo_BS_JAVA/openapiServlet",
					type : "post",
					dataType : "json",
					data : "&portType=" + portType + "&method=getBatchPort",
					async : false,
					success : function(data) {
						$("#associateId_port").empty();
						var Option = document.createElement("OPTION");
						document.getElementById("associateId_port").options
								.add(Option);
						$.each(data, function(key, value) {
							var Option = document.createElement("OPTION");
							Option.value = key;
							Option.text = value;
							document.getElementById("associateId_port").options
									.add(Option);
						});
					}
				});
	}
</script>
</head>
<body onload="load()">
	<div class="inoutput_param_div1">
		<table width="100%">
			<tr>
				<td width="10%"></td>
				<td></td>
				<td width="40%"></td>
				<td></td>
			</tr>
			<tr>
				<td></td>
				<td align="left" width="25%"><font color='red'>*</font> <label
					id="nameLabel"></label></td>
				<td align="left"><input type="text" id="portGroupname"
					name="portGroupname"></td>
				<td align="left"><span class="span_tip"
					id="portGroupnameErrTip"> </span></td>
			</tr>
			<tr>
				<td></td>
				<td align="left"><font color='white'>*</font> <label
					id="descriptionLabel"></label></td>
				<td align="left"><input type="text" id="portGroupDescription"
					name="portGroupDescription"></td>
			</tr>
			<tr>
				<td></td>
				<td align="left"><font color='white'>*</font> <label
					id="portIdLabel"></label></td>
				<td align="left"><select id="portType" name="portType"
					style="width: 60px;" onchange="updatePort()">
						<option value="iscsi">ISCSI</option>
						<option value="fc">FC</option>
				</select> <select id="associateId_port" name="associateId_port"
					onmouseover="FixWidth(this)"><option></option></select></td>
			</tr>
			<tr>
				<td colspan="2"></td>
				<td align="left"><input class="btn"
					onmouseover="this.className='btn_mouseover'"
					onmouseout="this.className='btn'" type="button"
					id="createPortGroupBtn" onclick="createPortGroup();"></td>
				<td></td>
			</tr>
			<tr>
				<td colspan="2"></td>
				<td align="left"><label algin="left" id="PortGroup_status"
					name="PortGroup_status"> </label></td>
				<td></td>
			</tr>
		</table>
	</div>
</body>
